<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.2/??flexible_css.js,flexible.js"></script>
		<link rel="stylesheet" type="text/css" href="css/jsy.css"/>
		<link rel="stylesheet" type="text/css" href="css/public.css"/>
	</head>
	<body>
		<header>
			<div class="d1">
				<div class="fh">
					
				</div>
			</div>
			<div class="d2">
				用户结算
			</div>
			<div class="d3">
			</div>
		</header>
		<div style="height: 1.3rem;">
			
		</div>
		<div class="navi">
			<div class="navi_img">
				<img class="img1" src="jsyimg/js1.png" >
			</div>
			<div class="navi_wz">
				<div id="wz1">
					 四川、重庆、浙江、辽宁部分地区因国家疫情防控影响，商品到货存在一定延期,敬请谅解。
				</div>
				<div id="wz2">
					 河北、云南、黑龙江部分地区因国家疫情防控影响，商品到货存在一定延期，给您带来不便，敬请谅解。
				</div>
				<div id="wz3">
					 河南、江西、江苏部分地区因国家疫情防控影响，商品到货存在一定延期，给您带来不便，敬请谅解。
				</div>
				<div id="wz3">
					 河南、江西、江苏部分地区因国家疫情防控影响，商品到货存在一定延期，给您带来不便，敬请谅解。
				</div>
			</div>
			<div class="navi_img">
				<img class="img2" src="jsyimg/js2.png" >
			</div>
		</div>
		<div id="dz" class="navi2">
			添加收获地址
			<div class="navi2_fh">
				
			</div>
		</div>
		<div class="navi3">
			<div id="t1" class="navi3_ys_2">
				<div class="navi3_ys2">
					<img src="jsyimg/js4.png" >
					<span>支付宝</span>
				</div>
			</div>
			<div id="t2" class="navi3_ys">
				<div class="navi3_ys2">
					<img src="jsyimg/js5.png" >
					<span>小米钱包</span>
				</div>
			</div>
			<div id="t3" class="navi3_ys">
				<div class="navi3_ys2">
					<img src="jsyimg/js6.png" >
					<span>微信支付</span>
				</div>
			</div>
			<div id="t4" class="navi3_ys">
				<div class="navi3_ys2">
					<img src="jsyimg/js7.png" >
					<span>银联支付</span>
				</div>
			</div>
			<div id="t5" class="navi3_ys">
				<div class="navi3_ys2">
					<img src="jsyimg/js8.png" >
					<span>翼支付</span>
				</div>
			</div>
			<div id="t6" class="navi3_ys">
				<div class="navi3_ys2">
					<img src="jsyimg/js9.png" >
					<span>信用卡分期</span>
				</div>
			</div>
			<div id="t7" class="navi3_ys">
				<div class="navi3_ys2">
					<img src="jsyimg/js10.png" >
					<span>花呗分期</span>
				</div>
			</div>
			<div id="t8" class="navi3_ys">
				<div class="navi3_ys2">
					<img src="jsyimg/js11.png" >
					<span>小米分期</span>
					<div class="xiang">
						享24期免息
					</div>
				</div>
			</div>
		</div>
		<div class="sq">
			收起其他支付方式
			<div id="s"></div>
		</div>
		<div id="navi4_top" class="navi4">
			<div class="navi4_ys">
				<p>运费</p>
				<span>包邮</span>
			</div>
		</div>
		<div class="navi4">
			<div id="navi4_ys" class="navi4_ys">
				<p>电子普通发票</p>
				<div style="display: flex;align-items: center;">
					<span>个人</span>
					<div id="b"></div>
				</div>
			</div>
		</div>
		<div class="navi5">
			<div class="navi5_zys">
				<div class="navi5_ys">
					发票类型
				</div>
				<div class="navi5_ys2">
						电子普通发票
				</div>
				<p id="p">提示：该订单商品只提供子发票</p>
				<p id="p">电子发票是税务局认可的有效凭证，其法律效力、基本用途及使用规定同纸质发票。推荐使用电子发票，不怕丢失，更方便、环保。</p>
			</div>
			<div class="navi5_zys">
				<div class="navi5_ys">
					选择发票抬头
				</div>
				<div id="gr" class="navi5_ys2">
						个人
				</div>
				<div id="dr" class="navi5_ys2">
						单人
				</div>
				<p id="p">提示：该订单商品只提供子发票</p>
				<div id="tt1">
					<div class="navi5_ys3">
						<input type="text" name="" id="" value="个人" />
						<div class="navi5_fh">
							
						</div>
					</div>
					<div class="navi5_ys4">
						<div class="navi5_dx"></div>
						设置默认抬头
					</div>
				</div>
				<div id="tt3">
					<div id="tt2">
						<div class="navi5_ys3">
							<input type="text" name="" id="" value="个人" />
							<div class="navi5_fh">
								
							</div>
						</div>
						<div style="height: 0.3rem;">
							
						</div>
						<div class="navi5_ys3">
							<input type="text" name="" id="" value="" placeholder="纳税人识别号或统一社会信用代码"/>
							<img style="width: 0.55rem;" src="jsyimg/wh.png" >
						</div>
						<div style="height: 0.3rem;">
							
						</div>
						<div class="navi5_ys3">
							<input type="text" name="" id="" value="" placeholder="请填写单位地址(选填)"/>
						</div>	
						<div style="height: 0.3rem;">
							
						</div>
						<div class="navi5_ys3">
							<input type="text" name="" id="" value="" placeholder="请填写单位电话(选填)"/>
						</div>
						<div style="height: 0.3rem;">
							
						</div>
						<div class="navi5_ys3">
							<input type="text" name="" id="" value="" placeholder="请填写开户银行(选填)"/>
						</div>
						<div style="height: 0.3rem;">
							
						</div>
						<div class="navi5_ys3">
							<input type="text" name="" id="" value="" placeholder="请填写银行账号(选填)"/>
						</div>
						
					</div>
					<div class="sq2">
							收起
							<div id="c"></div>
					</div>
				</div>
			</div>
			<div class="navi5_ys">
				收票人手机
			</div>
			<div class="navi5_zys">
				<div class="navi5_ys3">
					<input type="text" name="" id="" value="15770719489" />
					<img style="width: 0.55rem;" src="jsyimg/wh.png" >
				</div>
			</div>
			<div class="navi5_ys">
				收票人邮箱
			</div>
			<div class="navi5_ys3">
				<input type="text" name="" id="" value="" placeholder="用于接收电子发票（选填）" />
				<div class="navi5_fh">
					
				</div>
			</div>
			<p id="p2">发票须知：</p>
			<p id="p3">1.发票金额为实际支付金额，不包含优惠券、礼品卡等；</p>
			<p id="p3">2.电子发票可以在订单完成后，在订单详情中下载和查看；</p>
			<p id="p3">3.小米有品商品的发票由小米有品开具，第三方商品的发票由相关企业单独开具；</p>
			<p id="p3">查看更多发票常见问题>></p>
			<div style="height: 0.4rem;">
				
			</div>
		</div>
		<div id="navi4_bottom" class="navi4">
			<div class="navi4_ys">
				<p>优惠卷</p>
				<div id="b"></div>
			</div>
		</div>
		<div class="dbnavi">
			<div class="dbnavi_ys">
				收票人邮箱
			</div>
			<div class="dbnavi_ys2">
				<input type="text" name="" id="" value="" placeholder="用于接收电子发票（选填）" />
				<div class="dbnavi_button">
					确定
				</div>
			</div>
		</div>
		<div class="navi6">
			<div class="navi6_ys">
				<img style="width: 1.1rem;" src="jsyimg/js12.jpg" >
				<span>Xiaomi 11 Ultra 12GB+256GB 陶瓷白</span>
				<span>5999.00</span>
			</div>
		</div>
		<div class="navi6">
			<div class="navi6_ys2">
				商品价格：5999.00
			</div>
			<div class="navi6_ys2">
				配送费用：0.00
			</div>
		</div>
		<div class="navi7">
			
		</div>
		<div class="bottom">
			<div class="dbleft">
				共1件 合计：<a>5999.00</a>
			</div>
			<div id="qfk" class="dbright">
				去付款
			</div>
		</div>
		<script type="text/javascript">
			var t1=document.querySelector("#t1");
			var t2=document.querySelector("#t2");
			var t3=document.querySelector("#t3");
			var t4=document.querySelector("#t4");
			var t5=document.querySelector("#t5");
			var t6=document.querySelector("#t6");
			var t7=document.querySelector("#t7");
			var t8=document.querySelector("#t8");
			var qfk=document.querySelector("#qfk");
			qfk.onclick=function(){
				window.location.href="wxfk.html";
			}
			t1.onclick=function(){
				t1.className=" navi3_ys_2";
				t2.className=" navi3_ys";
				t3.className=" navi3_ys";
				t4.className=" navi3_ys";
				t5.className=" navi3_ys";
				t6.className=" navi3_ys";
				t7.className=" navi3_ys";
				t8.className=" navi3_ys";
			}
			t2.onclick=function(){
				t2.className=" navi3_ys_2";
				t1.className=" navi3_ys";
				t3.className=" navi3_ys";
				t4.className=" navi3_ys";
				t5.className=" navi3_ys";
				t6.className=" navi3_ys";
				t7.className=" navi3_ys";
				t8.className=" navi3_ys";
			}
			t3.onclick=function(){
				t3.className=" navi3_ys_2";
				t2.className=" navi3_ys";
				t1.className=" navi3_ys";
				t4.className=" navi3_ys";
				t5.className=" navi3_ys";
				t6.className=" navi3_ys";
				t7.className=" navi3_ys";
				t8.className=" navi3_ys";
			}
			t4.onclick=function(){
				t4.className=" navi3_ys_2";
				t2.className=" navi3_ys";
				t3.className=" navi3_ys";
				t1.className=" navi3_ys";
				t5.className=" navi3_ys";
				t6.className=" navi3_ys";
				t7.className=" navi3_ys";
				t8.className=" navi3_ys";
			}
			t5.onclick=function(){
				t5.className=" navi3_ys_2";
				t2.className=" navi3_ys";
				t3.className=" navi3_ys";
				t4.className=" navi3_ys";
				t1.className=" navi3_ys";
				t6.className=" navi3_ys";
				t7.className=" navi3_ys";
				t8.className=" navi3_ys";
			}
			t6.onclick=function(){
				t6.className=" navi3_ys_2";
				t2.className=" navi3_ys";
				t3.className=" navi3_ys";
				t4.className=" navi3_ys";
				t5.className=" navi3_ys";
				t1.className=" navi3_ys";
				t7.className=" navi3_ys";
				t8.className=" navi3_ys";
			}
			t7.onclick=function(){
				t7.className=" navi3_ys_2";
				t2.className=" navi3_ys";
				t3.className=" navi3_ys";
				t4.className=" navi3_ys";
				t5.className=" navi3_ys";
				t6.className=" navi3_ys";
				t1.className=" navi3_ys";
				t8.className=" navi3_ys";
			}
			t8.onclick=function(){
				t8.className=" navi3_ys_2";
				t2.className=" navi3_ys";
				t3.className=" navi3_ys";
				t4.className=" navi3_ys";
				t5.className=" navi3_ys";
				t6.className=" navi3_ys";
				t7.className=" navi3_ys";
				t1.className=" navi3_ys";
			}
			

			var dz=document.querySelector("#dz");
			dz.onclick=function(){
				window.location.href="address.html";
			}
			
			var sq=document.querySelector(".sq");
			var navi3=document.querySelector(".navi3");
			var s=document.querySelector("#s");
			var x=true;
			sq.onclick=function(){
				if(x){
					navi3.style.height="3.9rem";
					s.className=" rotate45";
					s.style.marginTop="-0.2rem";
					x=false;
				}else{
					navi3.style.height="10.4rem";
					s.className=" rotate225";
					s.style.marginTop="0.1rem";
					x=true;
				}
			}
			
			var navi4_ys=document.querySelector("#navi4_ys");
			var b=document.querySelector("#b");
			var navi5=document.querySelector(".navi5");
			var x2=true;
			navi4_ys.onclick=function(){
				if(x2){
					navi5.style.display="block";
					x2=false;
				}else{
					navi5.style.display="none";
					x2=true;
				}
			}
			
			var navi5_bottom=document.querySelector("#navi4_bottom");
			var dbnavi=document.querySelector(".dbnavi");
			var x3=true;
			navi5_bottom.onclick=function(){
				if(x3){
					dbnavi.style.display="block";
					x3=false;
				}else{
					dbnavi.style.display="none";
					x3=true;
				}
			}
			
			var gr=document.querySelector("#gr");
			var dr=document.querySelector("#dr");
			var grk=document.querySelector("#tt1");
			var drk=document.querySelector("#tt2");
			var drk2=document.querySelector("#tt3");
			var sq2=document.querySelector(".sq2");
			gr.onclick=function(){
				grk.style.display="block";
				drk2.style.display="none";
			}
			dr.onclick=function(){
				grk.style.display="none";
				drk2.style.display="block";
			}
			var x4=true;
			
			sq2.onclick=function(){
				if(x4){
					drk.style.height="7.3rem";
					x4=false;
				}else{
					drk.style.height="2.3rem";
					x4=true;
				}
			}
			var sy=document.querySelector(".fh");
			sy.onclick=function(){
				window.location.href="xqy.html";
				// javascript:history.back();
			}
		</script>
	</body>
</html>
